@extends('master')
@section('title', $relato->titulo)
@section('content')

<div class="container-fluid">
    {{-- Cabezal --}}
    <div class="jumbotron text-center">
        <h1>{{ $relato->titulo }}</h1>
        <h5>{{ Str::upper($tag->nombre) }}</h5>
        <p>{{ $relato->bajada }}</p>
    </div>
    <div class="col-md-12">
        <ul class="list-inline text-center">
            <li><a href="#texto">Texto</a></li>
            <li>|</li>
            <li><a href="#destacados">Destacados</a></li>
        </ul>
        <br>
    </div>
    {{-- Fin Cabezal --}}

    {{-- Paquete Imagenes --}}
    <div class="row">
        @if( !$images->isEmpty() )
            {{--*/ $i=0; #contador /*--}} 
            @foreach($images as $image)
                @if($i % 3 == 0) {{-- Horizontales --}}
                    <div class="col-md-12">
                        <img class="lazy img-full" data-original="{{ URL::to($image->img->url('rel_horizontal')) }}" alt="{{ $image->title }}"/>
                        {{ HTML::epigrafe ($image->title) }}
                    </div>
                @else {{-- Verticales --}}
                    <div class="col-md-6 col-sm-6 col-xs-6">
                        <img class="lazy img-full" data-original="{{ URL::to($image->img->url('rel_vertical')) }}" alt="{{ $image->title }}"/>
                        {{ HTML::epigrafe ($image->title) }}
                    </div>
                @endif
                {{--*/ $i++; #contador /*--}}
            @endforeach
        @endif
    </div>
    <br>
    {{-- Fin Paquete Imagenes --}}

    <!-- Texto -->
    <div id="texto" class="row">
        <div class="col-md-8 col-md-offset-2">
            <p>{{ $relato->texto }}</p>
            <br>
            @include('compartir', ['titulo' => $relato->titulo])
        </div>
    </div>
    <!-- Fin Texto -->
</div>

    <hr>
        @if(!$objetos->isEmpty())
        <!-- Paquete Objetos Destacados -->
        <div class="container-fluid" id="destacados">
            <div class="row text-center">
                <h3>Destacados</h3>
                <br>
            </div>
            <div class="row">
                @foreach ($objetos as $objeto)
                    <div class="col-md-3 col-sm-6 text-center">
                        @if( $imagenObj = $objeto->imagesOrdered->first() )
                                <a href="{{ URL::route('objeto', ['slug' => $objeto->slug, 'id' => $objeto->id]) }}">
                                    <img class="lazy img-full" data-original="{{ URL::to($imagenObj->img->url('obj_mini')) }}" alt="{{ $imagenObj->title }}"/>
                                </a>
                        @endif
                        <ul class="list-unstyled">
                            <li><a href="{{ URL::route('objeto', ['slug' => $objeto->slug, 'id' => $objeto->id]) }}">{{ $objeto->nombre }}</a></li>
                            <li><em><a href="{{ $objeto->link }}" target="_blank">{{ $objeto->link_name }}</a></em></li>
                        </ul>
                    </div>
                @endforeach
            </div> {{-- .row --}}
        </div> {{-- .container-fluid --}}
        <!-- Paquete Objetos Destacados -->
        @endif
@stop